<template>
	<view class="container">
		<!-- <view class="list-cell b-b m-t" @click="navTo('个人资料')" hover-class="cell-hover" :hover-stay-time="50">
			<text class="cell-tit">个人资料</text>
			<text class="cell-more yticon icon-you"></text>
		</view>
		<view class="list-cell b-b" @click="navTo('收货地址')" hover-class="cell-hover" :hover-stay-time="50">
			<text class="cell-tit">收货地址</text>
			<text class="cell-more yticon icon-you"></text>
		</view>
		<view class="list-cell b-b" @click="navTo('实名认证')" hover-class="cell-hover" :hover-stay-time="50">
			<text class="cell-tit">实名认证</text>
			<text class="cell-more yticon icon-you"></text>
		</view>

		<view class="list-cell b-b m-t">
			<text class="cell-tit">消息推送</text>
			<switch checked color="#FFBC21" @change="switchChange" />
		</view>
		<view class="list-cell m-t b-b" @click="navTo('清除缓存')" hover-class="cell-hover" :hover-stay-time="50">
			<text class="cell-tit">清除缓存</text>
			<text class="cell-more yticon icon-you"></text>
		</view>
		<view class="list-cell b-b" @click="navTo('关于Dcloud')" hover-class="cell-hover" :hover-stay-time="50">
			<text class="cell-tit">关于Dcloud</text>
			<text class="cell-more yticon icon-you"></text>
		</view>
		<view class="list-cell">
			<text class="cell-tit">检查更新</text>
			<text class="cell-tip">当前版本 1.0.3</text>
			<text class="cell-more yticon icon-you"></text>
		</view> -->
		<!-- <view class="list-cell">
			<text class="cell-tit">关注微信公众号</text>
			<text class="cell-more yticon icon-you"></text>
		</view> -->
		<!-- <view class="list-cell">
			<text class="cell-tit">合同及协议</text>
			<text class="cell-more yticon icon-you"></text>
		</view>
		<view class="list-cell">
			<text class="cell-tit">关于我们</text>
			<text class="cell-more yticon icon-you"></text>
		</view> -->
		<!-- <view class="list-cell"  @tap="toPage('/pages/user/test')">
			<text class="cell-tit">H5游戏</text>
			<text class="cell-more yticon icon-you"></text>
		</view> -->
		<!-- <view class="list-cell">
			<text class="cell-tit">当前版本</text>
			<text class="cell-tip">V1.0.3</text>
		</view>
		<view class="log-out-btn" >
			<text class="cell-tit">退出登录</text>
		</view> -->

		<uni-list>
			<uni-list-item title="合同协议" :hide-hover="true" @tap="toPage('/pages/public/agreementList')"></uni-list-item>
			<uni-list-item title="关于我们" :hide-hover="true" @tap="toPage('/pages/public/aboutUs')"></uni-list-item>
			<!-- #ifdef APP-PLUS -->
			<uni-list-item title="当前版本" :hide-hover="true" :right-text='version'>
			</uni-list-item>
			<!-- #endif -->
		</uni-list>
		<!-- <view class="log-out-btn" @click="toLogout">
			<text class="cell-tit">退出登录</text>
		</view> -->
		<button class="log-out-btn" hover-class="button-hover" @click="toLogout">退出登录</button>

	</view>
</template>

<script>
	import {
		mapMutations
	} from 'vuex';
	import Api from '@/common/api';
	import uniList from "@/components/uni-list/uni-list.vue"
	import uniListItem from "@/components/uni-list-item/uni-list-item.vue"

	export default {
		data() {
			return {
				version: ''
			};
		},
		components: {
			uniList,
			uniListItem
		},
		onLoad() {
			// #ifdef APP-PLUS			
			this.version = `V${plus.runtime.version}`
			// #endif
			// #ifdef MP-WEIXIN
			//TODO
			// #endif
		},
		methods: {
			...mapMutations(['logout']),

			navTo(url) {
				this.$api.msg(`跳转到${url}`);
			},
			//退出登录
			toLogout() {
				var _this = this;
				uni.showModal({
					content: '确定要退出登录么',
					success: (e) => {
						if (e.confirm) {
							this.logout();
							let params = {};
							let data = Api.apiRequest('post', Api.index.get_lock, params);
							uni.navigateBack();
							// setTimeout(() => {
							// 	uni.navigateBack();
							// }, 200)


						}
					}
				});
			},
			//switch
			switchChange(e) {
				let statusTip = e.detail.value ? '打开' : '关闭';
				this.$api.msg(`${statusTip}消息推送`);
			},
			toPage(url) {
				if (!url) {
					uni.showToast({
						title: '暂未开通',
						icon: "none"
					});
					return;
				}
				uni.navigateTo({
					url: url
				})
			},
		}
	}
</script>

<style lang='scss'>
	page {
		background: $page-color-base;
	}

	.container {
		border-top: .5upx solid #f3f5f7;

		.uni-list {
			border-radius: 20upx;
			overflow: hidden;

			&:first-child {
				border-radius: 0 0 20upx 20upx;
			}
		}
	}

	.log-out-btn {
		margin-top: 40upx;
		display: flex;
		justify-content: center;
		align-items: center;
		width: inherit;
		height: 88upx;
		border-radius: 44upx;
		background-color: #E2E5E6;
		font-size: 28upx;
		color: #232323;
		margin: 40upx 30upx 0 40upx;
	}
</style>
